<template>
	<div>
		<div v-loading="loading">
			<Info v-bind="querys" v-model="infoData" state="readonly"></Info>
			<ChangeHistory v-bind="querys"></ChangeHistory>
			<div class="back">
				<el-button @click="back">返回</el-button>
			</div>
		</div>
	</div>
</template>

<script>
	import * as apis from '@/api/order/minOrder/contractChange/api.js';
	import Info from '../chunk/info/index.vue';
	import ChangeHistory from '@/views/order/minOrder/chunk/changeHistory/index.vue';
	export default {
		name: 'MinOrderChangeHistory',
		components: { Info, ChangeHistory },
		props: {},
		data() {
			return {
				querys: {},
				infoData: { previousData: {}, subsequentData: {} },
				loading: false,
			};
		},
		computed: {},
		created() {
			this.querys = this.$route.query ?? {};
			this.getInfo();
		},
		mounted() {},
		methods: {
			getInfo() {
				if (this.Empty(this.querys.orderCarId)) {
					this.$message.error('缺少参数 子订单id');
					return;
				}
				this.loading = true;
				apis.OrderInfo(this.querys.orderCarId)
					.then(res => {
						if (res.code == 200) {
							this.infoData = res.data ?? {};
							this._onload();
						}
					})
					.finally(() => {
						this.loading = false;
					});
			},
			back() {
				this.$router.push({
					name: 'MinContractChange',
					query: this.querys,
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.back {
		margin: 20px;
		background: #fff;
		padding: 15px 20px;
		display: flex;
		justify-content: flex-end;
	}
</style>
